<?php

$m = Model::getInstance();

YuppLoader::load("core.mvc.form", "YuppForm2");
YuppLoader::load("core.basic", "YuppDateTime");

$user = $m->get('user');

YuppLoader :: load('core.mvc', 'DisplayHelper');

global $_base_dir;

?>
<html>
   <head>
      <style type="text/css">
         /* Estilo para YuppForm */
         .field_container {
            width: 49%;
            text-align: left;
         	display: block;
            padding-top: 10px;
         }
         .field_container .label {
            display: inline;
            padding-right: 10px;
            vertical-align: top;
         }
         .field_container .field {
            display: block;
         }
         .field_container .field input {
         }
         .field_container .field input[type=text] {
         	width: 400px;
         }
         .field_container .field input[type=submit] {
            width: 100px;
         }
         .field_container .field textarea {
            width: 540px;
            height: 200px;
         }
         
         body {
            font-family: arial, verdana, tahoma;
            font-size: 12px;
            background-color: #efefef;
         }
         table {
            border: 1px solid #000;
            /* spacing: 0px; */
            border-collapse: separate;
            border-spacing: 0px;
         }
         td {
            border-bottom: 1px solid #ddd;
            padding: 5px;
            background-color: #f5f5f5;
         }
         #actions {
            background: #fff url(<?php echo $_base_dir; ?>/images/shadow.jpg) bottom repeat-x;
            border: 1px solid #ccc;
            border-style: solid none solid none;
            padding: 7px 12px;
         }
         #actions a {
            padding-right: 5px;
            padding-left: 5px;
         }
         .create{
           width: 49%;
           display: inline-block;
         }
         .col2 {
           width: 49%;
           display: inline-block;
           float: right;
         }
         /* ==========> tags del usuario que se renderean desde showUserTags.template.php */
         .tag {
           width: 32px;
           height: 32px;
           display: inline-block;
         }
      </style>
      <?php echo h('js', array('name'=>'jquery/jquery-1.7.1.min')); ?>
      <script type="text/javascript">
      
        // ----------------------------------------------------------
        function after_add_tag (result, status, response)
        {
          var ct = response.getResponseHeader("content-type") || "";
          
          //console.log(result);
          //console.log(status);
          //console.log(response);
          //console.log(ct); // text/html, text/plain
          
          if (ct == 'text/plain')
          {
            //console.log('TODO: ERROR '+ result);
            alert(result);
            return;
          }
          
          //if (ct == 'text/html')
          //{
            // div con tags actuales
            div = $('.user_tags');
            parent = div.parent();
          
            // Quita la div que muestra las tags actuales
            div.remove();
            
            // Muestra la div con las tags, incluyendo la nueva
            parent.append($(result));
          //}
        }
        
        // ----------------------------------------------------------
        // Si hay una tag existente seleccionada, la nueva tag se creara como hija de esa.
        // Aqui se le avisa al usuario que la nueva se va a crear sobre la tag seleccionada.
        function tag_creation()
        {
          // select[name=tagId].val() me da el id
          // texto de la option seleccionada
          seltag = $('select[name=tagId]>option:selected').text();
          newTagName = $('input[name=tagName]')[0].value;
          
          // Muestra mensaje de subtag solo si selecciono tag existente y hay texto en el input de nueva tag
          if (!!seltag && !!newTagName)
          {
            $('#tag_feedback').html('La nueva tag se crear&aacute; debajo de la tag seleccionada: '+ seltag);
            return;
          }
          $('#tag_feedback').html('');
        }
        
        // ----------------------------------------------------------
        // Colorea el bg las options del select de color de tags
        function color_select()
        {
          $('select[name=color] > option').each( function(i) {

            // Fondo y color del texto son el mismo asi no se ve el texto
            $(this).css({'background-color':$(this).text(), 'color':$(this).text()});
            
            // bg del select es el primer color
            if (i == 0) $(this).parent().css('background-color', $(this).text());
          });
        }
        
        // ----------------------------------------------------------
        // Imagen para la tag en el label del radio de imagen.
        function image_radio()
        {
          $('input[name=image]').each( function(i) {

            // Fondo y color del texto son el mismo asi no se ve el texto
            $('label', $(this).parent().parent()).html('<img src="<?php echo $_base_dir; ?>/apps/cms2/images/usertags/'+ $(this).val() +'" />');
            
            // bg del select es el primer color
            //if (i == 0) $(this).parent().css('background-color', $(this).text());
          });
        }
        
        // ----------------------------------------------------------
        // ready
        $(function() {
        
          // Verifica si hay tag seleccionada al ingresar un texto
          // para crear una nueva tag como hija de la seleccionada.
          $('input[name=tagName]').keyup( tag_creation );
          
          // Si cambia la seleccion de etiqueta existente, cambia
          // el mensaje o lo quita si no se selecciona ninguna.
          $('select[name=tagId]').change( tag_creation );
          
          // Colorea el select
          color_select();
          
          // Color de fondo del select
          $('select[name=color]').change( function() {
            $(this).css('background-color', $('option:selected', this).text());
          });
          
          // Imagen para seleccionar para tag
          image_radio();
          
          // Muestra los iconos para nuevas usertags horizontalmente
          $('input[type=radio]').parent().parent().css({
            'display':'inline-block',
            'padding-right': '5px',
            'width':'32px',
            'clear':'both',
            'text-align':'center'
          });
        });
      </script>
   </head>
   <body>
      <h1>Editar usuario</h1>
      
      <?php echo DisplayHelper::errors( $user ); ?>

      <div class="create">
      <?php
         // Por si no tiene la fecha seteada.
         $birthDate = NULL;
         try { $birthDate = YuppDateTime::dateParts( $user->getBirthdate() ); }
         catch( Exception $e) {}
         
         $f = new YuppForm2( array('action'=>'save', 'method'=>'post') );
         $f->add( YuppForm2::hidden( array('name'=>'id',       'value'=>$user->getId()) ) )
           ->add( YuppForm2::text(   array('name'=>'name',     'value'=>$user->getName(),  'label'=>'Nombre') ) )
           ->add( YuppForm2::text(   array('name'=>'email',    'value'=>$user->getEmail(), 'label'=>'Email' ) ) )
           ->add( YuppForm2::text(   array('name'=>'username', 'value'=>$user->getUsername(), 'label'=>'Usuario' ) ) );
           //->add( YuppForm2::text(   array('name'=>'password', 'value'=>$user->getPassword(),  'label'=>'Clave' ) ) );
         
         if ( $birthDate !== NULL )
           $f->add( YuppForm2::date(
                          array(
                            'name'       =>'birthdate', 
                            'value_year' =>$birthDate['year'],
                            'value_month'=>$birthDate['month'],
                            'value_day'  =>$birthDate['day'], 
                            'label'      =>'Fecha de nacimiento'
                          ) ) );
         else
            $f->add( YuppForm2::date(
                          array(
                            'name'       =>'birthdate', 
                            'value_year' =>1980,
                            'label'      =>'Fecha de nacimiento'
                          ) ) );
                                     
         $f->add( YuppForm2::select(
                          array(
                            'name'    => 'usertype', 
                            'value'   => $user->getUsertype(), 
                            'label'   => 'Tipo',
                            'options' => array( // TODO: pedir lista a la clase
                                User::TYPE_PENDING =>'pendiente',
                                User::TYPE_USER    =>'usuario',
                                User::TYPE_EDITOR  =>'editor',
                                User::TYPE_ADMIN   =>'admin',
                            )
                          ) ) )
           ->add( YuppForm2::text(   array('name'  =>'company',  'value'=>$user->getCompany(),  'label'=>'Institucion') ) )
           ->add( YuppForm2::text(   array('name'  =>'position', 'value'=>$user->getPosition(), 'label'=>'Cargo') ) )
           
           ->add( YuppForm2::submit( array('name'  =>'doit',     'label'=>'Guardar cambios')) )
           ->add( YuppForm2::submit( array('action'=>'show',     'label'=>'Cancelar')) );
         
         YuppFormDisplay2::displayForm( $f );
      ?>
      </div>
      
      <div class="col2">
        <div id="tag_feedback"></div>
        <?php
        // Asignar etiqueta existente al usuario.
        $f = new YuppForm2( array('action'=>'addTag', 'method'=>'post', 'isAjax'=>true, "ajaxCallback"=>"after_add_tag") );
        $f->add( YuppForm2::hidden( array('name'=>'id', 'value'=>$user->getId()) ) )
          ->add( YuppForm2::select( array(
                            'name'=>'tagId', 'value'=>'', 'label'=>'Seleccione etiqueta',
                            'options'=>UserTag::selectTags('id', 'name', $user->getTags()),
                            'addEmpty'=>true) ) );

        // Crear y asignar nueva etiqueta
        // Asignar etiqueta existente al usuario.
        $f->add( YuppForm2::text( array('name'=>'tagName', 'value'=>'', 'label'=>'Nombre de nueva etiqueta') ) )
          ->add( YuppForm2::select( array( 'name'=>'color', 'value'=>'', 'label'=>'Color', 'options'=>UserTag::getColorMap() ) ) );
          
          /*
          ->add( YuppForm2::select( array( 'name'=>'image', 'value'=>'', 'label'=>'Icono', 'options'=>array( // TODO sacar el array de la base o del filesystem
            'student_openehr_32.png'=>'student_openehr_32.png',
            'champion_32.png'=>'champion_32.png',
            'blue-ribbon_32.png'=>'blue-ribbon_32.png'
          ) ) ) );
          */
        
        // Radios para imagenes, que no se pueden mostrar con select...
        $imgs = FileSystem::getFileNames('./apps/cms2/images/usertags', '/^.*\.(jpg|jpeg|png|gif)$/i');
        //$imgs = array('student_openehr_32.png', 'champion_32.png', 'blue-ribbon_32.png', 'forum_king_32.png', 'social_networks_32.png');
        foreach ($imgs as $img)
        {
          $f->add( YuppForm2::radio( array( 'name'=>'image', 'value'=>$img, 'label'=>$img ) ) );
        }
          
        $f->add( YuppForm2::text( array('name'=>'points', 'value'=>'0', 'label'=>'Puntos') ) )
          ->add( YuppForm2::submit( array('name' =>'doit', 'label'=>'Agregar etiqueta')) );
        YuppFormDisplay2::displayForm( $f );
        ?>
        <?php Helpers::template(array('controller'=>'user', 'name'=>'showUserTags', 'args'=>array('user'=>$user))); ?>
      </div>
   </body>
</html>